<template>
  <!--  <img alt="Vue logo" src="./assets/logo.png">-->
  <formPage :formData="this.$data"/>
</template>

<script>
import formPage from "./components/formPage.vue";

export default {
  name: 'App',
  components: {
    formPage
  },
  methods: {
    init() {
      this.socket = new WebSocket('ws://localhost:3000/ws')
      // 监听socket连接
      this.socket.onopen = this.open
      // 监听socket错误信息
      this.socket.onerror = this.error
      // 监听socket消息
      this.socket.onmessage = this.getMessage
      // this.$http.get('/api/form').then(res => {
      //   console.log(res)
      // })
    },
    open(t) {
      console.log('ws open', t)
      this.socket.send('hello')
      setInterval(() => {
        this.socket.send('hello' + this.idx)
        this.idx++;
      }, 1000)
    },
    getMessage(t) {
      console.log('get', t)
    }
  },
  data: function () {
    return {
      socket: null,
      idx: 0
    }


  },
  mounted() {
    this.init()
  }
}
</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>
